<template>
  <Crumb />

  <div class="setting">
    <el-form label-position="right" :label-width="150">
      <el-form-item label="秒杀订单超过：">
        <el-input placeholder="订单编号" v-model="numberData.flashOrderOvertime">
          <template #append>分</template>
        </el-input>
        <div class="last">未付款，订单自动关闭</div>
      </el-form-item>
      <el-form-item label="正常订单超过: ">
        <el-input placeholder="订单编号" v-model="numberData.normalOrderOvertime">
          <template #append>分</template>
        </el-input>
        <div class="last">未付款，订单自动关闭</div>
      </el-form-item>
      <el-form-item label="发货超过：">
        <el-input placeholder="订单编号" v-model="numberData.confirmOvertime">
          <template #append>天</template>
        </el-input>
        <div class="last">未收货，订单自动完成</div>
      </el-form-item>
      <el-form-item label="订单完成超过：">
        <el-input placeholder="订单编号" v-model="numberData.finishOvertime">
          <template #append>天</template>
        </el-input>
        <div class="last">自定结束交易，不能申请售后</div>
      </el-form-item>
      <el-form-item label="订单完成超过：">
        <el-input placeholder="订单编号" v-model="numberData.commentOvertime">
          <template #append>天</template>
        </el-input>
        <div class="last">自动五星好评</div>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitFn">提交</el-button>
      </el-form-item>
    </el-form>

  </div>
</template>
    
<script setup lang='ts'>
import Crumb from "@/components/Crumb/index.vue";
import { reactive, ref } from "vue";
import * as http from "@/request/api";
import { ElMessage, ElMessageBox } from 'element-plus'
const input2 = ref("")


let numberData: IgetOrderRes = reactive({
  commentOvertime: 0,
  confirmOvertime: 0,
  finishOvertime: 0,
  flashOrderOvertime: 0,
  id: 0,
  normalOrderOvertime: 0,
})

// 发送请求
http.order.getOrderSetting({ id: 1 }).then((res) => {
  console.log(res);
  numberData.commentOvertime = res.data.commentOvertime;
  numberData.confirmOvertime = res.data.finishOvertime;
  numberData.finishOvertime = res.data.finishOvertime;
  numberData.flashOrderOvertime = res.data.flashOrderOvertime;
  numberData.id = res.data.id;
  numberData.normalOrderOvertime = res.data.normalOrderOvertime;
})

// 提交
const submitFn = () => {
  const { commentOvertime, confirmOvertime, finishOvertime, flashOrderOvertime, id, normalOrderOvertime } = numberData
  ElMessageBox.confirm(
    '是否要确定退出?',
    '提示',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    })
    .then(() => {
      http.order.postOrderSettingUpdate({
        commentOvertime,
        confirmOvertime,
        finishOvertime,
        flashOrderOvertime,
        id,
        normalOrderOvertime
      }).then((res) => {
        ElMessage.success('修改成功')
      })
      // ElMessage({
      //   type: 'success',
      //   message: '提交成功',
      // })

    })
    .catch(() => {
      console.log(435325);

    })
}

</script>
    
<style lang="less" scoped>
.setting {
  padding: 20px 15px;
  margin-top: 60px;
  border: 1px solid #ebeef5;
  width: 800px;
  position: absolute;
  left: 0;
  right: 0;
  margin: 100px auto;
}

:deep(.el-input) {
  width: 300px;
  height: 30px;
}
</style>